import React from "react";
import Loading from "@/components/Loading";
import LayoutLoading from "@/components/LayoutLoading";
import Vistor from "@/pages/statistics/vistor";

const Page404 = React.lazy(() => import("@/components/404"));
const Person = React.lazy(() => import("@/pages/Person"));
const Login1 = React.lazy(() => import("@/pages/Login/login1"));
const Login2 = React.lazy(() => import("@/pages/Login/login2"));
const MainLayout = React.lazy(() => import("@/components/Layout/MainLayout"));
const RadarList = React.lazy(() => import("@/pages/radar/radarManage")); // 雷达管理
const AbnormalAlarm = React.lazy(() => import("@/pages/abnormalAlarm"));
const Journal = React.lazy(() => import("@/pages/operateLog"));
const DataExport = React.lazy(() => import("@/pages/dataExport"));
const RadarEventList = React.lazy(() => import("@/pages/radar/Events/List"))
const RoleList = React.lazy(() => import("@/pages/Role"))
const CardList = React.lazy(() => import("@/pages/Main/CardList"))
const TableList = React.lazy(() => import("@/pages/Main/TableList"))

export function createLayoutRoutes() {
  return [
    {
      path: '/login1',
      name: '登录1',
      exact: true,
      component: (props: any) => (
        <React.Suspense fallback={<div/>}>
          <Login1 {...props} />
        </React.Suspense>
      )
    },
    {
      path: '/person',
      name: '个人介绍',
      exact: true,
      component: (props: any) => (
        <React.Suspense fallback={<div/>}>
          <Person {...props} />
        </React.Suspense>
      )
    },
    {
      path: '/',
      name: '首页',
      component: (props: any) => (
        <React.Suspense fallback={<div/>}>
          <MainLayout {...props} />
        </React.Suspense>
      )
    },
    {
      name: "404",
      path: `*`,
      component: () => (
        <React.Suspense fallback={<LayoutLoading/>}>
          <Page404/>
        </React.Suspense>
      ),
    }
  ]
}

const subRoutes = [
  {
    path: '/main',
    name: '登录2',
    exact: true,
    component: (props: any) => (
      <React.Suspense fallback={<div/>}>
        <TableList {...props} />
      </React.Suspense>
    )
  },
  {
    name: "预警列表",
    path: `/main/radar/events/init`,
    component: (props: any) => (
      <React.Suspense fallback={<Loading/>}>
        <RadarEventList {...props}>预警列表</RadarEventList>
      </React.Suspense>
    ),
  },
  {
    name: "雷达管理",
    path: `/main/info/radar-manage`,
    component: (props: any) => (
      <React.Suspense fallback={<Loading/>}>
        <RadarList {...props} />
      </React.Suspense>
    ),
  },
  {
    name: "角色管理",
    path: `/system/role`,
    component: (props: any) => (
      <React.Suspense fallback={<Loading/>}>
        <RoleList {...props} />
      </React.Suspense>
    ),
  },
  {
    name: "异常警报",
    path: `/system/alarm`,
    component: (props: any) => (
      <React.Suspense fallback={<Loading/>}>
        <AbnormalAlarm {...props} />
      </React.Suspense>
    ),
  },
  {
    name: "操作日志",
    path: `/operateLog`,
    component: (props: any) => (
      <React.Suspense fallback={<Loading/>}>
        <Journal {...props} />
      </React.Suspense>
    ),
  },
  {
    name: "数据导出",
    path: `/data-export`,
    component: (props: any) => (
      <React.Suspense fallback={<Loading/>}>
        <DataExport {...props} />
      </React.Suspense>
    ),
  },
  {
    name: "访客统计",
    path: `/statistics/visitor`,
    component: (props: any) => (
      <React.Suspense fallback={<Loading/>}>
        <Vistor {...props} />
      </React.Suspense>
    ),
  },
]

export default subRoutes
